<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>理想国真惠玩</title>
    <!-- UIkit CSS -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/uikit@3.2.2/dist/css/uikit.min.css"/>
</head>
<body style="height: 2000px;">
<div id="test-easing" class="uk-height-large uk-background-cover uk-overflow-hidden uk-light uk-flex"
     style="background-image: url('../images/bg/1.jpg');margin-top: 300px;">
    <div class="uk-grid uk-margin-auto uk-margin-auto-vertical uk-flex-inline">
        <div>
            <div class="uk-card uk-card-default uk-padding-small" uk-parallax="y: 200; easing: -2">-2</div>
        </div>
        <div>
            <div class="uk-card uk-card-default uk-padding-small" uk-parallax="y: 200; easing: -1">-1</div>
        </div>
        <div>
            <div class="uk-card uk-card-default uk-padding-small" uk-parallax="y: 200; easing: -0.5">-0.5</div>
        </div>
        <div>
            <div class="uk-card uk-card-default uk-padding-small" uk-parallax="y: 200; easing: 0">0</div>
        </div>
        <div>
            <div class="uk-card uk-card-default uk-padding-small" uk-parallax="y: 200; easing: 0.5">0.5</div>
        </div>
        <div>
            <div class="uk-card uk-card-default uk-padding-small" uk-parallax="y: 200; easing: 1">1</div>
        </div>
        <div>
            <div class="uk-card uk-card-default uk-padding-small" uk-parallax="y: 200; easing: 2">2</div>
        </div>
    </div>
</div>

<!-- UIkit JS -->
<script src="https://cdn.jsdelivr.net/npm/uikit@3.2.2/dist/js/uikit.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/uikit@3.2.2/dist/js/uikit-icons.min.js"></script>
</body>
</html>